{template "content","header"}
<link rel="stylesheet" href="http://xs01.meituan.net/kui/1.8.2/css/@waimai/kangarooui.min.css">
<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<div class="container" style="width:960px;">

    <h1 class="well text-danger"><i class="fa fa-smile-o"></i> 有问必答... <button id="btnShow" style="height:40px;" class="btn btn-primary"><i class="fa fa-pencil"></i> 我要提问...</button> <button style="display:none; height: 40px;" id="btnClose" class="btn btn-primary">收起... <i class="fa fa-close"></i></button></h1>
    <form style="display:none;" action="?m=ask&c=index&a=add" method="post" name="myform" id="myform" class="form-horizontal">
        <div class="form-group">
            <label class="control-label col-md-2">姓名：</label>
            <div class="col-md-4">
                <input type="text" name="username" required oninvalid="setCustomValidity('请填写姓名...')" oninput="setCustomValidity('')" id="username" placeholder="姓名..." class="form-control">
            </div>
            <span class="text-danger h4">*</span>
        </div>

        <div class="form-group">
            <label class="control-label col-md-2">电话：</label>
            <div class="col-md-4">
                <input type="tel" name="phone" id="phone" required oninvalid="setCustomValidity('电话号码格式不正确...')" oninput="setCustomValidity('')" pattern="^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}" placeholder="电话..." class="form-control">
            </div>
            <span class="text-danger h4">*</span>
        </div>

        <div class="form-group">
            <label class="control-label col-md-2">问题描述：</label>
            <div class="col-md-4">
                <textarea name="question" id="question" class="form-control" rows="6" required oninvalid="setCustomValidity('请填写您要咨询的问题...')" oninput="setCustomValidity('')" placeholder="请填写您要咨询的问题..."></textarea>

            </div>
            <span class="text-danger h4">*</span>
        </div>

        <div class="form-group">
            <input type="hidden" name="q_time" id="q_time" value="">
        </div>

        <div class="form-group">
            <input type="hidden" name="is_ask" id="is_ask" value="">
        </div>

        <div class="form-group">
            <label class="control-label col-md-2"></label>
            <div class="col-md-4">
                <input style="height:40px; width: 100px;" type="submit" name="dosubmit" id="dosubmit" class="btn btn-primary" value=" 提交 ">
            </div>

        </div>

    </form>

    <div class="panel panel-info">
        <div class="panel-heading">
            <h3><i class="fa fa-free-code-camp"></i> 最新问答...</h3>
        </div>
        {pc:get sql="select * from v9_ask ORDER BY id DESC" num="6" page="$_GET[page]"}
        <div class="panel-body">
            {loop $data $v}
            <div class="media">

                <div class="media-body">
                    <h5 class="media-heading text-muted"><i class="fa fa-clock-o"></i> {date('Y-m-d H:i:s',$v[q_time])}</h5>
                    <p class="h5 strong text-muted">
                        <i class="fa fa-user-circle"></i> {$v[username]}
                        <i class="fa fa-envelope"></i>&nbsp;&nbsp;
                        <span class="text-infot">
                            <i class="fa fa-quote-left"></i>
                            &nbsp;{$v[question]}&nbsp;
                            <i class="fa fa-quote-right"></i>
                        </span>
                    </p>
                    {if $v[is_ask] == 1}
                    <div class="alert alert-danger"><i class="fa fa-envelope-open"></i>&nbsp; {$v[ask]}</div>
                    {else}
                    <div class="alert alert-info">请耐心等待老师回复...</div>
                    {/if}
                </div>
            </div>

            {/loop}
        </div>
        {/pc}
    </div>
    {if $pages}
    <div class="page pull-right">{$pages}</div>{/if}



</div>
<script>
    var myform = document.querySelector("#myform");
    var btnShow = document.querySelector("#btnShow");
    var btnClose = document.querySelector("#btnClose");
    btnShow.onclick = function() {
        myform.style.display = "block";
        btnClose.style.display = "inline-block";
    }

    btnClose.onclick = function() {
        myform.style.display = "none";
        btnClose.style.display = "none";
    }
</script>
{template "content","footer"}